<template>
	<view>
		<u-navbar title-color="#333" title-bold title-size="36" title="修改密码" :border-bottom="false"></u-navbar>
		
		<view class="u-m-t-80 u-p-l-32 u-p-r-32">
			<view class="input-div u-m-t-22 flex">
				<view class="input-lable">旧密码</view>
				<view class="input-value">
					<input type="password" v-model="oldpwd" />
				</view>
			</view>
			<view class="input-div u-m-t-22 flex">
				<view class="input-lable">新密码</view>
				<view class="input-value">
					<input type="password" v-model="newpwd" />
				</view>
			</view>
			
			<view class="input-div u-m-t-22 flex">
				<view class="input-lable">确认密码</view>
				<view class="input-value">
					<input type="password" v-model="newpwdTwo" />
				</view>
			</view>
			
			
		</view>
		<view class="btn-bo">
			<button class="btn_login_btn" @click="savepassword">确认</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				oldpwd:'',
				newpwd:'',
				newpwdTwo:'',
				
			}
		},
		
		methods: {
			savepassword(){
				if(this.newpwd!=this.newpwdTwo){
					this.$u.toast('两次密码不相同');
					return
				}
				this.$http.savepassword({
					token: uni.getStorageSync("token"),
					"old_password":this.oldpwd, 
					"new_password": this.newpwd
				}).then(res => {
					this.$u.toast('修改成功');
					setTimeout(()=>{
						uni.removeStorageSync('userInfo')
						uni.removeStorageSync('token')
						uni.reLaunch({
							url:"/pages/login/login"
						})
					},1000)
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.input-div{
		width: 100%;
		height: 80rpx;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		border: 1rpx solid #DDDDDD;
		padding: 24rpx 30rpx;
		
		.input-lable{
			font-size: 28rpx;
			color: #000000;
			padding-right: 20rpx;
			width: 140rpx;
		}
		
		.input-value{
			border-left: 1px #BDBDBD solid;
			padding-left: 20rpx;
			width: auto;
		}
	}
	
	.w472{
		width: 472rpx;
	}
	
	.input-div1{
		width: 202rpx;
		height: 82rpx;
		background: #FFFFFF;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
		border: 1rpx solid #DBDBDB;
		font-size: 28rpx;
		color: #E10F21;
		margin-left: 12rpx;
		text-align: center;
		line-height: 82rpx;
	}
	.codebtn{
		font-size: 28rpx;
		color: #E10F21;
	}
	
	.btn-bo{
		width: 750rpx;
		height: 120rpx;
		background: #FFFFFF;
		box-shadow: 0rpx -2rpx 8rpx 2rpx rgba(0,0,0,0.14);
		padding-top: 14rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		
		.btn_login_btn{
			width: 686rpx;
			height: 90rpx;
			background: linear-gradient( 180deg, #FA2D2D 0%, #F40000 100%);
			border-radius: 46rpx 46rpx 46rpx 46rpx;
			// margin-top: 116rpx;
			font-size: 36rpx;
			color: #FFFFFF;
			line-height: 90rpx;
			margin-left: 32rpx;
			text-align: center;
		}
	}
</style>
